{extend name="common/main"}

{block name="css"}
<!-- 本页面需要额外添加的css请在此处添加 -->
<style>
	body{font-size:x-small}
	.offercard_page{width:5.9rem;height:2.44rem;background:url(/mobiled/images/offercard.png?1438789002) no-repeat;background-size:5.9rem 12.6rem;margin:0 auto; margin-top:10px; margin-bottom:10px}
	.offercard_type1{background-position:0 -2.54rem}
	.offercard_page .icon_doller{font-size:.48rem;font-style:normal;color:#FFF;opacity:0.7;float:left;margin:.5rem 0 0 .3rem}
	.offercard_page .offercard_price{font-family:Impact;font-size:1.64rem;float:left;color:#FFF;opacity:0.7;margin:.6rem 0 0 .15rem;width:2.3rem;text-align:center;letter-spacing:-.1rem}
	.offercard_page .offercard_price em{font-style:normal;font-size:1.4rem}
	.offercard_page .offercard_typename{float:left;margin:1.5rem 0 0 .04rem;color:#fff;opacity:0.7}
	.offercard_page .offercard_classfy{font-size:.24rem;color:#FFF;opacity:0.7;float:left;margin:.25rem 0 0 .1rem;width:2.5rem}
	.offercard_page .offercard_type{font-size:.24rem;color:#FFF;opacity:0.7;float:left;margin:.1rem 0 0 .1rem;width:2.5rem}
	.offercard_page .offercard_use{float:left;background:#72c039;height:.56rem;width:2.2rem;border-radius:.28rem;line-height:.56rem;text-align:center;color:#d5ffb7;margin:.25rem 0 0 .1rem}
	.offercard_page .offercard_limit{width:80%;float:left;margin:0 0 0 1.08rem;color:#61ac2b}
	.offercard_type2{background-position:0 -5.08rem}
	.offercard_type2 .offercard_use{color:#c0ddff;background:#5ba0f1}
	.offercard_type2 .offercard_limit{color:#3984dc}
	.offercard_type3{background-position:0 -7.62rem}
	.offercard_type3 .offercard_use{color:#ffa4aa;background:#e03c47}
	.offercard_type3 .offercard_limit{color:#dd343f}
	.offercard_type4{background-position:0 -10.16rem}
	.offercard_type4 .offercard_use{color:#ffd6ae;background:#f2a456}
	.offercard_type4 .offercard_limit{color:#e09041}
	.offercard_over{background-position:0 0}
	.offercard_over .offercard_use{color:#e9e9e9;background:#ccc}
	.offercard_over .offercard_limit{color:#c4c4c4}
</style>
<script type="text/javascript">
    function remReSize(){var w = $(window).width();console.log(w);try{w = $(parent.window).width();}catch(ex){};if(w>640){w = 640;};$('html').css('font-size',100/640*w+'px');$('#js_style_for_pc').remove();$('body').append('<style id="js_style_for_pc">.m_header{margin-left: -'+w/2+'px;}.m_menu{margin-left: -'+w/2+'px;}</style>');};remReSize();$(window).resize(remReSize);$(document).ready(function() {remReSize();});for(var i=0;i<3;i++){setTimeout(remReSize, 100*i);};</script>
{/block}

{block name="body"}
<body>
<header>
  <div class="tab_nav">
    <div class="header">
      <div class="h-left"><a class="sb-back" href="{:url('User/index')}" title="返回"></a></div>
      <div class="h-mid">我的优惠券</div>
      <div class="h-right">
        <aside class="top_bar">
          <div onClick="show_menu();$('#close_btn').addClass('hid');" id="show_more"><a href="javascript:;"></a> </div>
        </aside>
      </div>
    </div>
  </div>
</header>
{include file="common/goods_nav"}
<div class="order">
	<div class="Evaluation">
	      <ul>
	      	<li><a href="{:url('User/coupon',array('type'=>0))}" class="tab_head {if $type eq 0}on{/if}" id="goods_ka1">未使用</a></li>
	        <li><a href="{:url('User/coupon',array('type'=>1))}" class="tab_head {if $type eq 1}on{/if}" id="goods_ka2">已使用</a></li>
	        <li><a href="{:url('User/coupon',array('type'=>2))}" class="tab_head {if $type eq 2}on{/if}" id="goods_ka3">已过期</a></li>
	      </ul>
	</div>
	
	<div class="Emain" id="user_goods_ka_1" style="display:block">
		{volist name="coupon_list" id="coupon"}
			<div class="offercard_page offercard_type{if $type eq 0}1{/if}{if $type eq 1}2{/if}{if $type eq 2}0{/if}">
				<span class="offercard_price">&yen;<em>{$coupon.money|intval}</em></span>
				<span class="offercard_typename">券</span>
				<span class="offercard_classfy">消费满</span>
				<span class="offercard_type">{$coupon.condition}使用</span>
				<a class="offercard_use" href="javascript:void();">&yen;{$coupon.money}</a>
				<span class="offercard_limit">使用期{$coupon.use_end_time|date='Y-m-d',###}</span>
				<i class="clear"></i>
			</div>
		{/volist}
	</div> 	 
{notempty name="coupon_list"}
   <div id="getmore" style="font-size:.24rem;text-align: center;color:#888;padding:.25rem .24rem .4rem; clear:both">
  		<a href="javascript:void(0)" onClick="ajax_sourch_submit()">点击加载更多</a>
    </div>  	
{/notempty}
</div>
{include file="common/bar"}
</body>
{/block}
{block name="js"}
<script>
var  page = 1;
 /*** ajax 提交表单 查询订单列表结果*/  
 function ajax_sourch_submit()
 {	 	 	 
        page += 1;
		$.ajax({
			type : "GET",
            url:"{:url('User/coupon')}",
            data : {
			    page:page,
				type:{$type}
			},
			success: function(data)
			{
				if($.trim(data) == '')
					$('#getmore').hide();
				else
				    $("#user_goods_ka_1").append(data);
			}
		}); 
 } 
</script>
{/block}